<style>
    .fly-column{display: none;}
</style>
#@layout()

#define main()
<div class="layui-container">
    <div class="layui-row layui-col-space15">
        <div class="layui-row">
            <div class="layui-col-xs12">
                <div class="layui-carousel" id="test10">
                    <div carousel-item="">
                        <div><img src="//res.layui.com/images/layui/demo/1.png" style="width: 100%;height: 100%"></div>
                        <div><img src="//res.layui.com/images/layui/demo/2.png" style="width: 100%;height: 100%"></div>
                        <div><img src="//res.layui.com/images/layui/demo/3.png" style="width: 100%;height: 100%"></div>
                        <div><img src="//res.layui.com/images/layui/demo/4.png" style="width: 100%;height: 100%"></div>
                        <div><img src="//res.layui.com/images/layui/demo/5.png" style="width: 100%;height: 100%"></div>
                        <div><img src="//res.layui.com/images/layui/demo/6.png" style="width: 100%;height: 100%"></div>
                        <div><img src="//res.layui.com/images/layui/demo/7.png" style="width: 100%;height: 100%"></div>
                    </div>
                </div>
            </div>
            <div class="layui-col-xs12">

            </div>
        </div>
    </div>
</div>
#end

#define js()
<script>
    layui.cache.page = '';
    layui.cache.user = {
        username: '游客'
        ,uid: -1
        ,avatar: '../res/images/avatar/00.jpg'
        ,experience: 83
        ,sex: '男'
    };
    layui.config({
        version: "3.0.0"
        ,base: '../res/mods/' //这里实际使用时，建议改成绝对路径
    }).extend({
        fly: 'index'
    }).use(['fly','carousel'],function () {
        var carousel = layui.carousel;
        carousel.render({
            elem: '#test10'
            ,width: '100%'
            ,height: '330px'
            ,interval: 5000
        });

    });
</script>
#end